01 · Colour
One blue,
eleven depths
eleven depths
#009DD1 sits at the centre of an 11-step tidal ramp. The light end is shallow water for surfaces; the deep end is open ocean for focus and night. A single warm Sunrise accent is held back for reward and human warmth. It's the only non-blue colour with an emotional job.
BoneF6F4F0 · light canvas
WhiteFFFFFF · surfaces
FogE3E8EB · dividers
Slate5E6E79 · secondary text
Ink0A1218 · text
Accent
SunriseFF9E6D · reward only02 · Gradients
Light through
water
water
Four gradients, each tied to a state of mind. They live only on full-bleed backgrounds (onboarding, the player, reward moments) so the app feels like a place. Never on buttons, chips or small cards, which stay flat and legible.
Morning Water · arriveOnboarding, welcome back, assessment intros. 300 → 500 → 800 → 950, radial from top-left like low sun.
Deep Tide · focusExercise player and evening use. Low glare. A breathing glow (6s cycle) paces the rep tempo.
First Light · achieveMilestones and week completions. Blue warming into Sunrise. Used rarely, so it stays meaningful.
Shallow · everydayThe daily canvas: Today, Plan, Progress. A whisper of 50 at the top fading into Bone.
03 · Typography
Two voices
Archivo is one variable family with a width axis. Condensed at 800 it's the athletic voice for numbers, timers and calls to move. At normal width it's the calm, highly legible UI and clinical text.
Instrument Serif italic is the human voice: one emotive word or line per moment, never for instructions.
Hero numeral
Archivo 800 · wdth 64
120 / 0.8507:42
Archivo 800 · wdth 64
120 / 0.8507:42
Display
Archivo 800 · wdth 70
56 / 0.92 · capsCore & glutes
Archivo 800 · wdth 70
56 / 0.92 · capsCore & glutes
Emotive
Instrument Serif italic
44 / 1.05You kept going.
Instrument Serif italic
44 / 1.05You kept going.
Title
Archivo 600 · wdth 100
26 / 1.2How did that session feel?
Archivo 600 · wdth 100
26 / 1.2How did that session feel?
Body
Archivo 400
17 / 1.5Lie on your back with knees bent. Squeeze your glutes and lift your hips until your body makes a straight line.
Archivo 400
17 / 1.5Lie on your back with knees bent. Squeeze your glutes and lift your hips until your body makes a straight line.
Label
Archivo 700 · wdth 110
12 · +0.12em capsToday · Strengthen phase · Week 3
Archivo 700 · wdth 110
12 · +0.12em capsToday · Strengthen phase · Week 3
04 · Imagery
One grade
owns it all
owns it all
Stock and commissioned photos arrive with clashing pinks, oranges and greens. The Tide grade brings them into one world. Soft pulls saturation back and washes skin and space towards blue while keeping people looking human; use it for content. Full is a blue duotone for atmosphere, night and brand moments. Drag the divider to compare.
✓ Natural light, real places
✓ Mid-movement, unposed
✓ Side-on, so the movement reads
✕ Hands clutching backs
✕ Red-glow anatomy
Photography: Unsplash — Bruce Mars, Gabin Vallet, Gabriel Martin, Jonathan Borba, Logan Weaver, Vitaly Gariev. Final product should commission a casting closer to the 30–75 audience.
05 · Personalisation
Made for
your body
your body
The Today hero isn't a banner, it's a mirror. The photo, headline and session come from your assessment. Light follows the clock: Soft grade in the morning, full duotone and a wind-down session in the evening. Your name is set in the human serif. Try it.
From your assessment
Time of day
Body-matched imagery. Each condition has its own photo set, shot side-on so the movement reads.
Light as context. After 6pm, Deep Tide and a gentler wind-down take over. It's the same brand in a different mood.
The Track line redraws whenever the plan changes, a small signal that this was made for you just now.
06 · Motion
Small touches
Six motions carry the brand. Each one explains something or confirms something. None runs while you're reading instructions, and all fall back to a still frame with Reduce Motion.
Track line drawThe logo zig-zag draws in 1.6s on arrival, plan change and completion. ease (.65,0,.35,1).
Breath glowA soft pulse on Deep Tide, synced to rep tempo (3s), so you can follow it without reading.
Slow pushHero photos drift 8% over 22s, so the screen feels alive but is never distracting.
CausticsLight-through-water shimmer on Morning Water, screen-blended at 50%, with an 18s cycle.
Numeral rollCounts roll upward rather than swapping, so progress feels physical. 400ms per step.
ConfirmA check draws and one ring ripples out on logging pain or finishing a session. It plays once, never loops in the product.
07 · In use
Three moments
The direction tested at the three points that matter most for retention: the invitation, the exercise, and the week-3 milestone.
The invitation. A body-matched photo in Soft grade, a condensed headline and the Track line. One white pill to act.
The focus. A faint Full-grade photo sets the place, the glow breathes at rep tempo and the numeral rolls up with each rep.
The reward. First Light with a ghosted group photo: you're one of many who got here. The numbers are the trophy.
08 · Surfaces & controls
Quiet
on top
on top
Atmosphere sits underneath; controls on top stay flat, solid and high-contrast. Pills for actions, 28pt-radius sheets, no glass and no drop shadows except the one sheet lifting off the page.
On light
Start my assessment
I have an access code
Lower backNeckKnee
On Deep Tide
Start session
Make it easier
About right ✓Too easy
Average pain3/10